Ext.define('FirstMate.view.Map', {
	id : 'mapView',
	extend : 'Ext.Container',
	requires : 'Ext.Map',
	alias : 'widget.mapview',
	config : {
		layout : 'fit',
		items : [		 
		 {
		 docked: 'top',
		 xtype: 'toolbar',
		 layout : {
			 pack : 'center'
		 },
		 scrollable: {
			    direction: 'horizontal',
			    directionLock: true
		 },
		 //ui : 'light',
		 items : [
			        {
			        	//text : 'Satellite',
				        iconCls: 'globe2',
				        iconMask: true,
				        ui : 'round',
	  				    listeners : {
		                    tap : function (widget) {
		                 	   var map = Ext.getCmp('extmap').getMap();
		                    	if (map.getMapTypeId() == 'hybrid'){
		                    		map.setMapTypeId('terrain');                    		
		                    		//widget.setText('Satellite');
		                 	   }else{
		                 		   	map.setMapTypeId('hybrid');
		                 		    //widget.setText('Terrain');
		                 	   }		                 	   
		                    }
					    }			
			        },
			        {
			        	//'text : ' + Zoom',
				        iconMask: true,
				        iconCls: 'add',
			        	ui : 'round',
	  				    listeners : {
		                    tap : function (widget) {
		                 	    
		                    	FirstMate.app.zoomLevel = Ext.getCmp('extmap').getMap().getZoom();
		                    	FirstMate.app.zoomLevel++;
		                 	   	Ext.getCmp('extmap').getMap().setZoom(FirstMate.app.zoomLevel);
		                 	    FirstMate.app.getController('Settings').saveSettings();
		                    }
					    }			            
			        },
			        {
			        	//text : ' - Zoom',
				        ui : 'round',
				        iconMask: true,
				        iconCls: 'minus2',
	  				    listeners : {
		                    tap : function (widget) {
		                    	FirstMate.app.zoomLevel = Ext.getCmp('extmap').getMap().getZoom();
		                    	FirstMate.app.zoomLevel--;
		                 	   	Ext.getCmp('extmap').getMap().setZoom(FirstMate.app.zoomLevel);
		                 	    FirstMate.app.getController('Settings').saveSettings();
		                    }
					    }			
			        },
			        {
			        	//text : 'Find Me',
				        ui : 'round',
				        iconCls: 'locate',
				        iconMask: true,
	  				    listeners : {
		                    tap : function (widget) {
		                        if (Ext.device.Geolocation){
		                          	Ext.device.Geolocation.getCurrentPosition({
		                  	          success: function(position) {        	        	  
		                  	        	  FirstMate.app.position = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
		                  	        	  FirstMate.app.getController('Map').resetMap();
		                  	          },
		                  	          failure: function() {
		                  	        	  FirstMate.app.position = new google.maps.LatLng(0, 0);
		                  	        	  Ext.Msg.alert('Problem accessing geolocation.', 'Please make sure geolocation is on', Ext.emptyFn);
		                  	          }
		                          	}); 	
		                        }else{
			                    	FirstMate.app.geo.updateLocation();
		                        };
		                    }
					    }			
			        }
		          ]
		 },
		 
		{
			id : 'extmap',
			xtype : 'map',
			useCurrentLocation : false,
			mapOptions : {
				zoom : 10,
				mapTypeId : 'terrain',
				labels : true,
			    disableDefaultUI: true,
			    disableDoubleClickZoom : true,
			    panControl: false,
			    zoomControl: false,
			    //mapTypeControl: google.maps.MapTypeControlStyle.HORIZONTAL_BAR,
			    scaleControl: true,
			    streetViewControl: true,
			    overviewMapControl: true
			    //,
			    //zoomControlOptions: {
			    //    style: google.maps.ZoomControlStyle.SMALL
			    //}
			},			
			listeners : {
				initialize : function() {					
					FirstMate.app.googleMap = Ext.getCmp('extmap').getMap();				 
					google.maps.event.addListener(FirstMate.app.googleMap,
							'click', function(event) {
						//console.log('CLICK');
								FirstMate.app.getController('Map').removeTidesMarkers();		
								FirstMate.app.position = event.latLng;
								//FirstMate.app.resetMap(), scope=FirstMate.app;
						   		FirstMate.app.Marker.setPosition(FirstMate.app.position);
						   		FirstMate.app.Marker.setTitle(FirstMate.app.Marker.getPosition().toString());
						   		Ext.getCmp('extmap').getMap().setCenter(FirstMate.app.Marker.getPosition());
								FirstMate.app.bounds = FirstMate.app.getController('Map').getBounds(FirstMate.app.Marker.getPosition());
								Ext.getStore('tidesStationsStore').filterByGeoBounds(FirstMate.app.bounds);
								FirstMate.app.getController('Settings').setAppDate();
								FirstMate.app.getController('Settings').getAsOfDateField().setValue(FirstMate.app.date);
								//Ext.getStore('tidesStore').loadAll(FirstMate.app.date);
								Ext.getStore('marineWeatherStore').loadWeather(FirstMate.app.position);
								FirstMate.app.getController('Map').addNOAAZonesLayer();
								FirstMate.app.getController('Map').addHRRadarLayer();	
							});
				}
			}
		} 
		]
	}

});
